<template>
  <view class="search-container" :style="{'background-color':bgcolor}">
    <view class="search-box" :style="{'border-radius':radius+'rpx'}" @click="searchHeadle">
      <uni-icons type="search" size="17"></uni-icons>
      <text>收索</text>
    </view>
  </view>
</template>

<script>
  export default {
    name: "my-search",
   props: {
      //背景颜色
      bgcolor: {
        type: String,
        default: "#1296db"
      },
      //圆角大小
      radius: {
        type: Number,
        default: 30
      }
    },
    data() {
      return {

      }
    },
    methods:{
      searchHeadle(){
        this.$emit('click')
      }
    }
  }
</script>

<style lang="scss">
  .search-container {
    // background-color: #1296db;
    width: 100%;
    padding: 10rpx 0;
    height: 40px;

    .search-box {
      background-color: #fff;
      margin: 0 auto;
      height: 72rpx;
      width: 85%;
      line-height: 72rpx;
      text-align: center;
      // border-radius: 30rpx;
    }
  }
</style>
